<!DOCTYPE html>
<meta charset="UTF-8">
<html>
	<link href="css/bootstrap.min.css" rel="stylesheet" />
	<link href="css/bootstrap-theme.min.css" rel="stylesheet" />
	<link href="css/read.css" rel="stylesheet" />
	<script src='jquery-1.10.2.min.js'></script>

	<head>
		<title>来答几个小问题吧</title>
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			
			body {
				background-color: #E4E1EA;
				font: normal 17px/1.5 Calibri, Candara, Segoe, "华文中宋", "楷体", Optima, Arial, sans-serif;
				color: #000;
			}
			
			.wrapper {
				width: 1200px;
				margin: 20px auto;
				align-content: center;
			}
			
			p {
				margin: 15px 0 5px 0;
			}
			
			ul {
				list-style: none
			}
			
			li span {
				display: inline-block;
				vertical-align: top;
			}
			
			strong {
				font-weight: bold;
			}
			
			.radio-btn input[type="radio"],
			.check-box input[type="checkbox"] {
				visibility: hidden;
			}
			
			.radio-btn {
				width: 25px;
				height: 25px;
				display: inline-block;
				float: left;
				margin: 3px 7px 0 0;
				cursor: pointer;
				position: relative;
				-webkit-border-radius: 100%;
				-moz-border-radius: 100%;
				border-radius: 100%;
				border: 1px solid #ccc;
				box-shadow: 0 0 1px #ccc;
				background: rgb(255, 255, 255);
				background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(47%, rgba(246, 246, 246, 1)), color-stop(100%, rgba(237, 237, 237, 1)));
				background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
				background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
				background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
				background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
				filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=0);
			}
			
			.checkedRadio {
				-moz-box-shadow: inset 0 0 5px 1px #ccc;
				-webkit-box-shadow: inset 0 0 5px 1px #ccc;
				box-shadow: inset 0 0 5px 1px #ccc;
			}
			
			.radio-btn i {
				border: 1px solid #E1E2E4;
				width: 10px;
				height: 10px;
				position: absolute;
				left: 4px;
				top: 4px;
				-webkit-border-radius: 100%;
				-moz-border-radius: 100%;
				border-radius: 100%;
			}
			
			.checkedRadio i {
				background-color: #898A8C;
			}
		</style>
		<!--<script src="js/prefixfree.min.js"></script>-->
	</head>

	<body>
		<div class="container">
			<h1></h1>
			<nav class="navbar navbar-inverse">
				<!-- Brand and toggle get grouped for better mobile display -->
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-menu" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
					<a class="navbar-brand" href="#">SDE</a>
				</div>
				<div id="navbar-menu" class="collapse navbar-collapse">
					<ul class="nav navbar-nav">
						<li class="active">
							<a href="#">软件与数据工程研究中心</a>
						</li>
					</ul>
				</div>
			</nav>

			<div class="wrapper">
				<p>下面哪一则广告你见过</p>
				<table style="border-collapse:separate; border-spacing:20px; ">
					<tr>
						<td>
							 <label for="imgad1"> 
							<!--<a href="javascript:;" onclick="$("#imgad1").attr("checked",'checked')">-->
								<img src="pic/ad1.jpg" align="middle" width="400px" height="320px">
							<!--</a>-->
							 </label> 
						</td>
						<td>
							<label for="imgad2">
							<!--<a href="javascript:;" onclick="$("#imgad2").attr("checked",'checked')">-->
								<img src="pic/ad5.jpg" align="middle" width="400px" height="320px">
								<!--</a>-->
								</label>
						</td>
					</tr>
					<tr>
						<td>
							<input name="radio2" id="imgad1" type="radio" class="radio-btn" value="A" /></li>
						</td>
						<td>
							<input name="radio2" id="imgad2" type="radio" class="radio-btn" value="B" /></li>
						</td>
					</tr>

					<tr>
						<td>
							<label for="imgad3">
                                <img src="pic/ad6.jpg" align="middle" width="400px" height="320px">
                                 </label>
						</td>
						<td>
							<label for="imgad4">
                                <img src="pic/ad7.jpg" align="middle" width="400px" height="320px">
                                 </label>
						</td>
					</tr>
					<tr>
						<td>
							<input name="radio2" id="imgad3" type="radio" class="radio-btn" value="C" />
						</td>
						<td>
							<input name="radio2" id="imgad4" type="radio" class="radio-btn" value="D" />
						</td>
					</tr>
				</table>

			</div>
			<!--<div style="text-align:center;clear:both">-->
			<!--<script src="/gg_bd_ad_720x90.js" type="text/javascript"></script>-->
			<!--<script src="/follow.js" type="text/javascript"></script>-->
		</div>
		<!--<script src="js/index.js"></script>-->
	</body>

</html>
<!-- <style type="text/css">
	/*Custom checkbox*
	/*.check-box {*/
    /*width: 22px;
    height: 22px;
    cursor: pointer;
    display: inline-block;
    margin: 2px 7px 0 0;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 1px #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: rgb(255, 255, 255);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(47%, rgba(246, 246, 246, 1)), color-stop(100%, rgba(237, 237, 237, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=0);
    border: 1px solid #ccc;
}*/
			/*.check-box i {
    background: url('css/check_mark.png') no-repeat center center;
    position: absolute;
    left: 3px;
    bottom: -15px;
    width: 16px;
    height: 16px;
    opacity: .5;
    -webkit-transition: all 400ms ease-in-out;
    -moz-transition: all 400ms ease-in-out;
    -o-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
    -webkit-transform:rotateZ(-180deg);
    -moz-transform:rotateZ(-180deg);
    -o-transform:rotateZ(-180deg);
    transform:rotateZ(-180deg);*/
			/*}
.checkedBox {
    -moz-box-shadow: inset 0 0 5px 1px #ccc;
    -webkit-box-shadow: inset 0 0 5px 1px #ccc;
    box-shadow: inset 0 0 5px 1px #ccc;
    border-bottom-color: #fff;
}
.checkedBox i {
    bottom: 2px;
    -webkit-transform:rotateZ(0deg);
    -moz-transform:rotateZ(0deg);
    -o-transform:rotateZ(0deg);
    transform:rotateZ(0deg);
}*/
/*Custom radio button*/
html,
			body,
			div,
			span,
			applet,
			object,
			iframe,
			h1,
			h2,
			h3,
			h4,
			h5,
			h6,
			p,
			blockquote,
			pre,
			a,
			abbr,
			acronym,
			address,
			big,
			cite,
			code,
			del,
			dfn,
			em,
			img,
			ins,
			kbd,
			q,
			s,
			samp,
			small,
			strike,
			strong,
			sub,
			sup,
			tt,
			var,
			b,
			u,
			i,
			center,
			dl,
			dt,
			dd,
			ol,
			ul,
			li,
			fieldset,
			form,
			label,
			legend,
			table,
			caption,
			tbody,
			tfoot,
			thead,
			tr,
			th,
			td,
			article,
			aside,
			canvas,
			details,
			embed,
			figure,
			figcaption,
			footer,
			header,
			hgroup,
			menu,
			nav,
			output,
			ruby,
			section,
			summary,
			time,
			mark,
			audio,
			video {
				margin: 0;
				padding: 0;
				border: 0;
				font-size: 100%;
				font: inherit;
				vertical-align: baseline
			}
			
			article,
			aside,
			details,
			figcaption,
			figure,
			footer,
			header,
			hgroup,
			menu,
			nav,
			section {
				display: block
			}
			
			body {
				line-height: 1
			}
			
			ol,*/
/*blockquote,
			q {
				quotes: none
			}
			
			blockquote:before,
			blockquote:after,
			q:before,
			q:after {
				content: '';
				content: none
			}
			
			table {
				border-collapse: collapse;
				border-spacing: 0
			}*/
</style>> -->